<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <!-- 

        图片的bug
            1 很多图片在一排的时候   左右会产生间距(代码换行产生的)   ---  直接使用浮动
            2 图片底下有3px的间距    不是margin，也不是padding     ---    img {vertical-align:top;}

        文本属性
            加粗    font-weight: lighter / normal / bold ;  100-900
            下划线  text-decoration:underline / none / line-through  
            首行缩进   text-indent:2em;   em 是一个相对单位 ，相对于字体大小而言的  
            字间距   letter-spacing:    字左右的间距  
            字体    font-family:"微软雅黑" , "宋体"    字体文件比较大，不建议使用特殊字体
            倾斜    font-style:italic / normal ;
            大小写的转换   text-transform:uppercase / lowercase / capitalize(首字母大写)

            继承性 ， 但是有一些标签自带样式，不会继承父元素的样式   inherit


        权重：优先级
            *       0      0000
            标签    1      0001
            class  10     0010
            id     100    0100
            后代   求和
            行内样式  1000
            !important 权重最高

        样式引入的方式
            外部样式   link   import(加载顺序的问题)
            内部样式
            行内样式

        
        背景属性
            background-color 
            background-images:url()
            background-repeat:
            background-position
            background-size:    此属性不能简写  css3


            如何区分背景图和插入图   ---  会不会经常更换，是否占位置


        列表样式   ---  切图    写背景图片

        字体图标  

     -->
    
</body>
</html>